<template>
  <div class="add-wrap">
    <div class="content">
      <ProductInput v-model="arr" maxHeight="unset" />
      <div class="item">
        <el-form inline label-position="left">
          <el-form-item label="送货单图：">
            <Uploader v-model="fileList" />
          </el-form-item>
        </el-form>
      </div>
    </div>
    <el-row style="margin: 20px 0 30px">
      <el-button size="large" type="primary" @click="save">提交入库</el-button>
    </el-row>
  </div>
</template>

<script>
import modifyMixins from "@/mixins/modifyMixins.vue";
import ProductInput from "./components/ProductInput.vue";

export default {
  mixins: [modifyMixins],
  components: {
    ProductInput,
  },
  data() {
    return {};
  },
  computed: {},
  mounted() {},
  methods: {
    save() {
      const materials = this.arr
        .filter((e) => e.id && e.count)
        .map((e) => {
          return { id: e.id, count: e.count, norms: e.norms };
        });
      const listImg = this.fileList[0] || "";
      if (!materials.length) return this.$message.error("请完善材料输入");
      if (!listImg) return this.$message.error("请上传送货单图");
      const params = {
        status: 1,
        materials,
        listImg,
      };
      this.$api.inoutUpdate(params).then((res) => {
        this.$message.success("入库成功");
        this.arr = [{ id: "", count: 0, key: this.$quinn.guid() }];
        this.fileList = [];
      });
    },
  },
};
</script>

<style lang="less" scoped>
.add-wrap {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;

  .content {
    flex: 1;
    overflow-y: auto;
    width: 100%;

    .item {
      width: 100%;
      display: flex;
      // justify-content: center;
      margin-bottom: 20px;
    }
  }
}
</style>
